<template>
<el-row :gutter="16" style="overflow-x:hidden padding-bottom:60px">


<el-col :span="24">
<div class="grid-content height_div">
<span class="serch_input1" style="padding-left:2px;width:108px;position:relative">
<el-select v-model="input3" placeholder="选择分类" @visible-change="handlerSelect">
<el-option v-for="positionName in opitionsDepartment" :key="positionName.id" :label="positionName.positionName" :value="positionName.id"></el-option>
</el-select>
<i @click="clearData" v-if="!!input3" class="el-icon-close optionIcon"></i>
</span>
<span class="serch_input1" style="padding-left:2px;position:relative;width:150px">
<span @click.stop="taggleBox3" class="el-cascader" :class="isOpen1?'is-opened':'none'" style="width:100%">
<div class="el-input">
<i class="el-input__icon el-icon-caret-bottom" :class="isOpen1?'is-reverse':'none'"></i>
<input v-model="searchDepName" autocomplete="off" placeholder="选择属性值" readonly="readonly" type="text" rows="2" class="el-input__inner">
</div><span class="el-cascader__label"></span></span>
<i @click="clearData1" v-if="!!searchDepName" class="el-icon-close optionIcon oicon"></i>
<div v-if="isOpen2" @mouseleave="isOpen2 = false" ref="cascaderBox" class="el-cascader-menus1 showBox" style="position: absolute; top: 44px; left: 0; transform-origin: center top 0px; z-index: 9999;" >
 <el-tree
  :data="regions2"
  :props="props1"
  :load="loadNode1"
  check-strictly=true
  lazy=''
  accordion
  @node-click="handleNodeClick2">
</el-tree>
</div>
</span>
<el-button style="margin-left:-2px" :loading="searchLoading" @click="searchDetail" icon="search">搜索</el-button>
<el-button style="margin-left:5px" @click='reflesh'><img class="userinfo_color" src="../../assets/reflesh.png" />刷新</el-button>
<el-button style="margin-left:5px" type="warning" @click="add()"><i class="el-icon-plus add"></i>添加</el-button>
</div>
<div class="main-table">

<el-table
v-loading="tableLoading"
ref="multipleTable"
:data="getVin"
border
tooltip-effect="dark"
style="margin-top:4px"
>

<el-table-column
align="center"
label="序号"
width="68">
<template scope="scope">{{ scope.$index+1}}</template>
</el-table-column>

<el-table-column
align="center"
label="分类挂载">
<template scope="scope">{{ scope.row.employeeName | noValueFilter}}</template>
</el-table-column>

<el-table-column
align="center"
label="属性类型"
show-overflow-tooltip>
<template scope="scope">{{ scope.row.phone | noValueFilter}}</template>
</el-table-column>

<el-table-column
align="center"
label="属性类型 "
show-overflow-tooltip>
<template scope="scope">{{ scope.row.positionName | noValueFilter}}</template>
</el-table-column>

<el-table-column
align="center"
label="属性输入方式"
show-overflow-tooltip>
<template scope="scope">
{{ scope.row.depName | noValueFilter}}
</template>
</el-table-column>

<el-table-column
label="操作"
width='160'
align="center"
>
<template scope="scope" class="style-cover">

<el-button
size="small"
type="info"
@click="showUpDate(scope.$index, scope.row)">修改</el-button>

<el-button
size="small"
type="danger"
@click="deletePerson(scope.$index, scope.row)">删除</el-button>

</template>
</el-table-column>
</el-table>


<el-col :span="24" class="pagination_top">
<el-pagination layout="total, sizes, prev, pager, next, jumper" @current-change="handleCurrentChange1"
@size-change="handleSizeChange"
:page-sizes="[10,20,30]"
:page-size="tpmPara.pageSize" :total="total">
</el-pagination>
</el-col>
<div style="clear:both"></div>
</div>
</el-col>



<!--添加数据-->
<div @click="" v-if="dialogAddFormVin">
<el-dialog @close="clearData" :title="addFormVin?'添加员工选项':'修改员工选项'" :visible.sync="dialogAddFormVin">

<el-form :model="ruleForm1" :rules="rules1" ref="ruleForm1" :label-position="labelPosition" label-width="100px" class="demo-ruleForm customForm">

<el-col :span="24"><div class="grid-content bg-purple-light">

<el-form-item class="form-cover" label='分类挂载:' prop="">
<el-select v-model="input3" placeholder="选择分类" @visible-change="handlerSelect">
<el-option v-for="positionName in opitionsDepartment" :key="positionName.id" :label="positionName.positionName" :value="positionName.id"></el-option>
</el-select>
<i @click="clearData" v-if="!!input3" class="el-icon-close optionIcon"></i>
</el-form-item>
<el-form-item label='属性类型:' prop="employeeName"><el-input size="small" placeholder='请输入属性名称' v-model="ruleForm1.employeeName" ></el-input></el-form-item>

<el-form-item class="form-cover" label='属性类型:' prop="">
    <el-radio v-model="sex" label="1">产品属性</el-radio>
    <el-radio v-model="sex" label="0">销售属性</el-radio>
</el-form-item>

<el-form-item class="form-cover" label='输入方式:' prop="">
    <el-radio v-model="sex" label="1">单选</el-radio>
    <el-radio v-model="sex" label="0">多选</el-radio>
</el-form-item>
</div></el-col>
<el-col :span="24"><div class="grid-content bg-purple-light">

</div></el-col>
<el-col class="addButton vin-add-cover" style="margin-left:-10px;margin-top:16px" :span="24">
<div style="width:100%;box-sizing:border-box;-moz-box-sizing:border-box;-webkit-box-sizing:border-box;padding:8px 0;text-align:center" class="grid-content vin-cover">
<el-button v-if="addFormVin" @click="cancelAdd('ruleForm1')" style="margin-right:50px" class="addButton_a">重置</el-button>
<el-button v-if="addFormVin" @click="addVin('ruleForm1')" style="margin-left:16px" :loading="addLoading1" class="addButton_a" type="warning">保存</el-button>
<el-button v-if="updatePersonnel" @click="cancel()" style="margin-right:50px" class="addButton_a">取消</el-button>
<el-button v-if="updatePersonnel" @click="upDate('ruleForm1')" style="margin-left:16px" :loading="addLoading" class="addButton_a" type="warning">保存</el-button>
</div>
</el-col>
</el-form>

</el-dialog>
</div>
</el-row>

</template>

<script>
import {mapState, mapMutations} from 'vuex'  
export default {
data() {
//校验
let checkIDNumber = (rule, value, callback) => {
let idNumber=this.ruleForm1.idNumber;
if(!idNumber){callback(new Error('身份证号不能为空'))}else{
if(!(/(^\d{15}$)|(^\d{18}$)|(^\d{17}(\d|X|x)$)/.test(idNumber))){
callback(new Error('身份证号格式不正确'));}else{callback()}
}};
let checkEmail = (rule, value, callback) => {
let email=this.ruleForm1.email;
if(!email){callback(new Error('电子邮箱不能为空'))}else{
if(!(/^([0-9A-Za-z\-_\.]+)@([0-9a-z]+\.[a-z]{2,3}(\.[a-z]{2})?)$/.test(email))){
callback(new Error('电子邮箱格式不正确'));}else{callback()}
}};

let checkPhone = (rule, value, callback) => {
let phone=this.ruleForm1.phone;
if(!phone){callback(new Error('电话号码不能为空'))}else{
if(/^1[3|4|5|8][0-9]\d{4,8}$/.test(phone)){
callback()}else{callback(new Error('电话号码格式不正确'))}
}};

let checkBirthday1 = (rule, value, callback) => {
let para='';
if(typeof(this.ruleForm1.birthData)==='object'){
let paraTime = this.formatting(this.ruleForm1.birthData*1000);
para = this.formatDate(paraTime);
}else{
para=this.formatDate(this.ruleForm1.birthData)
}
if(!this.ruleForm1.birthData){callback()}else{
if(this.tempBirthday!==para){callback(new Error('日期与身份证不一致'))}else{callback()}
}};

let checkHireDate = (rule, value, callback) => {
if(!this.ruleForm1.hireDate){callback(new Error('入职日期不能为空'))}else{callback()}
};

return {
isUp:true,
setPageS:10,
addLoading1:false,
dialogAddFormVin:false,
nameDepartment:'',
updateDictionany:false,
refleshLoading:false,
addDictionany:false,
tableLoading:false,
updateData:{
departmentInfo:{
  id:'',
  depName:'',
  parentId:'',
  description:''
  },
  depEmpMiddle:{
  depId:'',
  depName:'',
  depIdTrace:''
  }
},
opitions:[],
opitions1:[],
total:'',
labelPosition:'left',
input:'',
input1:'',
input2:'',
input3:'',
sex:'1',
isLeader:'0',
isBirthday:false,
showSign:false,
isShowSign:false,
tempBirthday:'',
ruleForm1:{
employeeCode:'',
employeeName:'',
sex:'1',
idNumber:'',
loginName:'',
loginPassword:'',
birthData:'',
hireDate:'',
email:'',
phone:'',
homeAddress:'',
photoPath:'',
positionName:'',
isLeader:'1',
loginPassword:'',
depName:'',
level:'',
depId:'',
positionId:'',
depIdTrace:''
},
depIdOut:'',
createDate1:'',
opitionsDepartment:[],
uploadFile:'',
getVin:[],
tpmPara:{},
tpmPara1:{},
tableData:[],
dialogS:false,
addLoading:false,
updateLoading:false,
delLoading:false,
showCascadeBox:false,
deletID:{},
url5:'/department/getDepTree',
url6:'/department/getPageOfList',
url7:'/department/add',
url8:'/department/update',
url9:'/department/delete',
url0:'/employee/getPageOfEmployee',
url11:'/employee/delete',
url12:'/employee/getEmployeeInfoDmByEmpId',
url13:'/employee/update',
url14:'/employee/add',
url15:'/position/getAll',
url16:'/employee/updateLeaveOffice',
formVinDiction:{
description:'',
parentId:''
},
isOpen:false,
isOpen1:false,
isOpen2:false,
isOpen4:false,
isOutDepID:false,
hierarchy:1,
hierarchy1:2,
regions: [],
regions1:[],
regions2:[],
regions3:[],
regions4:[],
regions5:[],
searchDepName:'',
searchDepData:'',
recordOption:[],
level:'',
levelArr:[],
levelArr1:[],
nameTree:'',
depIdTrace1:'',
len3:'',
tpm:[],
parentId1:'',
backShowName:'',
props: {
    label: 'name',
    children: 'f'
},
props1: {
    label: 'name'
},
props2: {
    label: 'name',
    children: 'zones'
},
props3: {
    label: 'name',
    children: 'zones'
},
props4: {
    label: 'name',
    children: 'zones'
},
count: 1,
count1:1,
count2:1,
count3:1,
count4:1,
rules: {
menuCode: [{ required: true, message: '请输入编码', trigger: 'blur' }],
},
rules1: {
IDNumber:[{validator: checkIDNumber,required: true,trigger: 'blur'}],
email:[{validator: checkEmail,required: true,trigger: 'blur'}],
phone:[{validator: checkPhone,required: true,trigger: 'blur'}],
employeeName: [{ required: true, message: '请输入员工姓名', trigger: 'blur' }],
birthData: [{ required: true, message: '请输入出生日期', trigger: 'blur' }],
hireDate: [{validator: checkHireDate,required: true,trigger: 'blur'}],
loginName: [{ required: true, message: '请输入登陆账号', trigger: 'blur' }],
positionName: [{ required: true, message: '请输入所属岗位', trigger: 'blur' }],
birthData:[{ validator: checkBirthday1,trigger: 'blur'}],
}
}
},
computed: {
...mapState(['opition','pageTpm']),
},
methods: {
...mapMutations(['DELETE_ITEM','ADD_ITEM','CHANGEISIN']),
//按需求验证如下：
changeIDNumber(){
this.$refs['ruleForm1'].validateField('IDNumber',(valid)=>{
this.tempBirthday=this.getBirthdayFromIdCard(this.ruleForm1.idNumber);
if (valid) {}else {console.log('error submit!!');return false;}});
},
changeEmail(){
this.$refs['ruleForm1'].validateField('email',(valid)=>{
if (valid) {}else {console.log('error submit!!');return false;}});
},
changePhoneNumber(){
this.$refs['ruleForm1'].validateField('phone',(valid)=>{
if (valid) {
}else {console.log('error submit!!');return false;}});
},
checkBirthday(){
this.$refs['ruleForm1'].validateField('birthData',(valid)=>{
if (valid) {}else {console.log('error submit!!');return false;}});
},
checkDep(){
if(!this.ruleForm1.depName&&!this.isShowSign){this.showSign=true}else{this.showSign=false}
},
getPositionData() {
this.$refs['ruleForm1'].validateField('positionName',(valid)=>{
if (valid) {}else {console.log('error submit!!');return false;}});
},
//通过身份证拿到出生日期
getBirthdayFromIdCard(idCard) {  
var birthday = "";  
if(idCard != null && idCard != ""){  
 if(idCard.length == 15){  
     birthday = "19"+idCard.substr(6,6);  
 } else if(idCard.length == 18){  
     birthday = idCard.substr(6,8);  
 }
 birthday = birthday.replace(/(.{4})(.{2})/,"$1-$2-");  
}  
return birthday;  
},
//验证是否跟身份证一致
validate1(formVinDiction) {
this.$refs[formVinDiction].validateField('menuCode',(valid)=>{
if (valid) {}else {console.log('error submit!!');return false;}});
},
//刷新
reflesh() {
this.tableLoading=true;
let pageTpm={
pageIndex:1,
pageSize:10,
depId:'',
employeeName:'',
hireDateStart:'',
hireDateEnd:'',
email:'',
positionId:''
}
this.tpmPara=pageTpm;
this.getEmployeeList(pageTpm);
this.getMenuList()
},
//由于需求频繁改动现将改动方法移植至如下
showErr() {
this.$notify({
title: '提示',
message: '该功能尚未开通',
type: 'warning'
});
return false;
},
//上传头像的方法，这个功能未提供
getFile(event){
this.uploadFile=event.target.files[0];
if(!/image\/\w+/.test(this.uploadFile.type)){
this.$notify({
title: '提示',
message: '文件必须为图片',
type: 'warning'
});
  return false; 
};
let reader = new FileReader();
reader.readAsDataURL(this.uploadFile);
reader.onload = function(e){
var image = new Image();
image.src = e.target.result;
var max=200;
image.onload = function(){ 
var canvas = document.getElementById("cvs"); 
var ctx = canvas.getContext("2d"); 
ctx.clearRect(0, 0, canvas.width, canvas.height); 
ctx.drawImage(image, 0, 0, 148, 148);
};  
}
},
//添加标签
add() {
this.showSign=false;
this.isOpen=false;
this.isOpen1=false;
this.isOpen2=false;
this.addFormVin=true;
this.updatePersonnel=false;
this.dialogAddFormVin=true;
this.ruleForm1={
employeeCode:'',
employeeName:'',
employeeName:'',
sex:'',
idNumber:'',
loginName:'',
loginPassword:'',
birthData:'',
hireDate:'',
email:'',
level:'',
phone:'',
homeAddress:'',
photoPath:'',
positionName:'',
isLeader:'',
loginPassword:'',
depName:'',
positionId:'',
depIdTrace:''
};
this.depIdOut='';
},
//添加方法
addVin(ruleForm) {
if(!this.ruleForm1.depName){setTimeout(()=>{this.showSign=true},130)}
if(this.ruleForm1.birthData){
let paraTime = this.formatting(this.ruleForm1.birthData*1000);
let para = this.formatDate(paraTime);
if(this.tempBirthday!==para){
this.$notify({
title: '提示',
message: '出生日期跟身份证号不一致',
type: 'warning'
});
}
}
//验证选项
this.$refs[ruleForm].validate((valid)=>{
if (valid) {
this.addLoading1=true;
let {positionName,positionId,depName,isLeader,level,depIdTrace,...employeeInfo}=this.ruleForm1;
console.log(this.ruleForm1)
if(employeeInfo.birthData){
employeeInfo.birthData = this.formatting(employeeInfo.birthData*1000); 
}
employeeInfo.hireDate = this.formatting(employeeInfo.hireDate*1000);
employeeInfo.sex=this.sex;
let len=this.opitionsDepartment.length||0;
let tpmData=this.opitionsDepartment;
for(let i=0;i<len;i++){
  if(tpmData[i]['positionName']===positionName){
  positionId=tpmData[i]['id']
  }
}
let empPosiMiddle={
  positionName:positionName,
  level:level,
  positionId:positionId
}
let depEmpMiddle={
  depName:this.nameDepartment,
  isLeader:this.isLeader,
  depIdTrace:this.depIdTrace1,
  depId:this.depIdOut
}
let addData={employeeInfo,empPosiMiddle,depEmpMiddle};
console.log(addData);
this.post(this.url14,addData).then((m)=>{
this.addLoading1=false;
if(m.data.result){
this.getEmployeeList(this.tpmPara);
this.$confirm('成功添加信息，是否继续添加？', '提示', {
confirmButtonText: '继续添加',
cancelButtonText: '返回员工列表',
type: 'success'
}).then(() => {
//可以用resetFields
this.ruleForm1={
employeeCode:'',
employeeName:'',
employeeName:'',
sex:'',
idNumber:'',
loginName:'',
loginPassword:'',
birthData:'',
hireDate:'',
email:'',
level:'',
phone:'',
homeAddress:'',
photoPath:'',
positionName:'',
isLeader:'',
loginPassword:'',
depName:'',
positionId:'',
depIdTrace:''
};
this.depIdOut='';
}).catch(() => {
this.dialogAddFormVin=false;
});
}
if(!m.data.result){
this.$notify({
title: '提示',
message: ''+ m.data.msg,
type: 'warning'
});
this.addLoading1=false;

}})} else {
console.log('error submit!!');
return false;
}
})
},
//重置
//取消
cancel() {
this.dialogAddFormVin=false;
},
cancelAdd(formName) {
//可以用resetFields即：this.$refs[formName].resetFields();
//this.$refs[formName].resetFields();
this.ruleForm1={
employeeCode:'',
employeeName:'',
employeeName:'',
sex:'',
idNumber:'',
loginName:'',
loginPassword:'',
birthData:'',
hireDate:'',
email:'',
level:'',
phone:'',
homeAddress:'',
photoPath:'',
positionName:'',
isLeader:'',
loginPassword:'',
depName:'',
positionId:'',
depIdTrace:''
};
this.depIdOut='';
},
//格式化时间
formatting(t){
return Date.parse(new Date(t))/1000
},
//时间戳转标准时间
formatDate(date){  
date = new Date(date);  
var y=date.getFullYear();  
var m=date.getMonth()+1;  
var d=date.getDate();  
var h=date.getHours();  
var m1=date.getMinutes();  
var s=date.getSeconds();  
m = m<10?("0"+m):m;  
d = d<10?("0"+d):d;  
return y+"-"+m+"-"+d+"";  
},
//显示更新信息      
showUpDate(index, row) {
this.sex=''+row.sex;
this.isLeader=''+row.isLeader;
this.tempBirthday=this.getBirthdayFromIdCard(row.idNumber);
this.isOpen=false;
this.isOpen1=false;
this.isOpen2=false;
this.dialogAddFormVin=true;
this.addLoading=false;
this.isUp=true;
this.vinInfoCheck=false;
this.dialogFormVin=true;
this.addFormVin=false;
this.updatePersonnel=true;
this.showSign=false;
this.depIdTrace1=row.depIdTrace;
let index1=row.depIdTrace.lastIndexOf(',');
let tpmID=row.depIdTrace.substring(index1+1,row.depIdTrace.length)
this.depIdOut=tpmID;
this.nameDepartment=row.depName;
if(!!row.birthData&&row.birthData!=0){row.birthData=+row.birthData}else{row.birthData=''}
//try{row.birthData=+row.birthData}catch(e){}
this.ruleForm1=row;
},
//更新功能
upDate(ruleForm1) {
this.$refs[ruleForm1].validate((valid)=>{
if (valid) {
this.addLoading=true;
let {positionName,positionId,depName,isLeader,level,depIdTrace,employeeId,...employeeInfo}=this.ruleForm1;
if(!!employeeInfo.birthData){
  if(!isNaN(employeeInfo.birthData)){employeeInfo.birthData = this.formatting(employeeInfo.birthData*1000)};
}else{employeeInfo.birthData=''}

if(!isNaN(employeeInfo.hireDate)){employeeInfo.hireDate = this.formatting(employeeInfo.hireDate*1000)};

employeeInfo.sex=this.sex;
employeeInfo.id=employeeId;
let len=this.opitionsDepartment.length||0;
let tpmData=this.opitionsDepartment;
for(let i=0;i<len;i++){
  if(tpmData[i]['positionName']===positionName){
  positionId=tpmData[i]['id']
  }
}
let empPosiMiddle={
  positionName:positionName,
  level:level,
  positionId:positionId,
  empId:employeeId
}
let depEmpMiddle={
  depName:this.nameDepartment,
  isLeader:this.isLeader,
  depIdTrace:this.depIdTrace1,
  depId:this.depIdOut,
  empId:employeeId
}
let updateData={employeeInfo,empPosiMiddle,depEmpMiddle};
this.post(this.url13,updateData).then((m)=>{
this.isUp=false;
this.addLoading=false;
if(m.data.result){
this.dialogFormVin=false;
this.$notify({
title: '提示',
message: m.data.msg,
type: 'success'
});
this.dialogAddFormVin=false;
this.getEmployeeList(this.tpmPara);
}
if(!m.data.result){
this.$notify({
title: '提示',
message: m.data.msg,
type: 'error'
})}
}).catch((m)=>{

this.$notify({
title: '提示',
message: m.data.msg,
type: 'error'
})})
} else {
console.log('error submit!!');
return false;
}})
},
//搜索
searchDetail() {
this.tableLoading=true;
let pageTpm={
pageIndex:1,
pageSize:this.setPageS,
employeeName:this.input2,
email:this.input1,
positionId:this.input3,
depId:this.searchDepData
}
let para=Object.assign(this.tpmPara,pageTpm)
this.getEmployeeList(para);
},
//获取时间段
getTime(){
const temData = [];
for(var i in this.createDate1){
      temData[i]=this.formatting(this.createDate1[i]);
}
if(temData[0]===0){
this.tpmPara.hireDateStart='';
this.tpmPara.hireDateEnd='';
return;
}
this.tpmPara.hireDateStart=temData[0];
this.tpmPara.hireDateEnd=temData[1];

},


//转出功能
deletePerson(index,row) {
let tpm = {};
tpm.empId=row.employeeId;
this.delLoading=true;
this.$confirm('是否确定该员工已离职?', '提示', {
confirmButtonText: '确定',
cancelButtonText: '取消',
type: 'warning'
}).then(() => {
this.get(this.url16,tpm).then((m)=>{
if(m.data.result){
this.parentId1='';
this.delLoading=false;
this.$notify({
title: '提示',
message: m.data.msg,
type: 'success'
});
this.getEmployeeList(this.tpmPara);
this.getDepTree(this.tpmPara);
}
if(!m.data.result){
this.$notify({
title: '提示',
message:m.data.msg ,
type: 'warning'
});
}
})})
},
//员工离职了。。。
deletePersonOut() {},

//更改分页数据数
handleSizeChange(val) {
let para = {
pageIndex: 1,
pageSize: val
};
this.tpmPara=para;
this.getEmployeeList(this.tpmPara);
},
//增加树形节点 
loadNode(node, resolve) {
    //let para = {parentId:node.data.id}
    //if(this.count===1){this.count++;return};
    //this.getDepTree1(para,resolve);
    //this.count++;
    //这里这样写的原因是没有子项,可以去掉三角符号;这是elmment-ui的bug
    let para = {parentId:node.data.id}
    if(this.count===1){this.count++;return};
    this.get(this.url5,para).then((m)=>{
    if(m.data.result){
    let tpmData=m.data.data;
    let tpmData1=[];
    for(let i=0;i<tpmData.length;i++){
      tpmData1[i]={};
      tpmData1[i]["name"]=tpmData[i]["depName"];
      tpmData1[i]["id"]=tpmData[i]["id"];
      tpmData1[i]["description"]=tpmData[i]["description"];
    }
    this.regions1 = tpmData1;
    this.count++;
    if(tpmData1.length===0){resolve([]);return};
    resolve(tpmData1);
    }
    });
},
loadNode1(node, resolve) {
    let para = {parentId:node.data.id}
    if(this.count1===1){this.count1++;return};
    this.getDepTree1(para,resolve);
    this.count1++;
},
loadNode2(node, resolve) {
    let para = {parentId:node.data.id}
    if(this.count2===1){this.count2++;return};
    this.getDepTree1(para,resolve);
    this.count2++;
},
loadNode3(node, resolve) {
    let para = {parentId:node.data.id}
    if(this.count3===1){this.count3++;return};
    this.getDepTree1(para,resolve);
    this.count3++;
},
loadNode4(node, resolve) {
    let para = {parentId:node.data.id}
    if(this.count4===1){this.count4++;return};
    this.getDepTree1(para,resolve);
    this.count4++;
},

//获取树形列表1
getDepTree1(para,fn) {
let tpm='';
let tpm1='';
this.get(this.url5,para).then((m)=>{
if(m.data.result){
let tpmData=m.data.data;
let tpmData1=[];
for(let i=0;i<tpmData.length;i++){
  tpmData1[i]={};
  tpmData1[i]["name"]=tpmData[i]["depName"];
  tpmData1[i]["id"]=tpmData[i]["id"];
  tpmData1[i]["description"]=tpmData[i]["description"];
}
this.regions1 = tpmData1;

if(tpmData1.length===0){this.regions1=[];return};
fn(this.regions1);
}
}).catch((m)=>{
console.log(m);
})
},
//获取树形列表
getDepTree(pageTpm1) {
this.get(this.url5,pageTpm1).then((m)=>{
if(m.data.result){
let tpmData=m.data.data;
let tpmData1=[];
for(let i=0;i<tpmData.length;i++){
  tpmData1[i]={};
  tpmData1[i]["name"]=tpmData[i]["depName"];
  tpmData1[i]["id"]=tpmData[i]["id"];
  tpmData1[i]["description"]=tpmData[i]["description"];
}
this.regions =tpmData1;
this.regions2=tpmData1;
this.regions3=tpmData1;
this.regions4=tpmData1;
this.regions5=tpmData1;
}
}).catch((m)=>{
console.log(m);
})
},

confirmTreeData() {
  this.formVinDiction.parentId=this.tpmData.id;
},
//显示级联框与否
taggleBox3(){
  //this.count =1;
  this.count1=1;
  this.count2=1;
  this.count3=1;
  this.count4=1;
  this.isOutDepID=true;
  this.isOpen2=!this.isOpen2;
  if(this.isOpen2){this.getDepTree(this.pageTpm1)}
},
taggleBox2(){
 //this.count =1;
  this.count1=1;
  this.count2=1;
  this.count3=1;
  this.count4=1;
  this.isOutDepID=false;
  this.isOpen1=!this.isOpen1;
  if(this.isOpen1){this.getDepTree(this.pageTpm1)}
},
taggleBox1(){
 //this.count =1;
  this.count1=1;
  this.count2=1;
  this.count3=1;
  this.count4=1;
  this.isOutDepID=false;
  this.isOpen1=!this.isOpen1;
  if(this.isOpen1){this.getDepTree(this.pageTpm1)}
},
taggleBox() {
  //this.count =1;
  this.count1=1;
  this.count2=1;
  this.count3=1;
  this.count4=1;
  this.isOutDepID=false;
  this.isOpen4=!this.isOpen4;
  if(this.isOpen4){this.getDepTree(this.pageTpm1)}
},
//点击树
handleNodeClick(data,node){//这里是外面部门树的点击事件
this.nodeTree=node;
this.parentId1=data;//这个是点击树时候当下节点(部门)；
let tpmID='';
let tpmName='';
this.levelArr[node.level-1]=data;
let len=this.levelArr.length;
for(let i=0;i<node.level-1;i++){
tpmID+=(this.levelArr[i]['id']+',')
tpmName+=(this.levelArr[i]['name']+'/')
};
let len1=tpmID.length;
let len2=tpmName.length;
tpmID=tpmID.substr(0,len1-1);
tpmName=tpmName.substr(0,len2-1);
this.depIdTrace1=tpmID;
this.backShowName=tpmName;
this.updateData.departmentInfo.id=this.updateData.depEmpMiddle.depId=data.id;
this.updateData.departmentInfo.depName=data.name;
this.updateData.depEmpMiddle.depName=data.name;
this.updateData.departmentInfo.description=data.description;
if(node.level===1){this.updateData.departmentInfo.parentId='';}else{
this.updateData.departmentInfo.parentId=this.levelArr[node.level-2]['id'];
}
this.updateData.depEmpMiddle.depIdTrace=this.depIdTrace1;
let tpmPara=null;
if(data.id===1){tpmPara={depId:''}}else{tpmPara={depId:data.id};}
let para=Object.assign(this.tpmPara,tpmPara);
this.getEmployeeList(this.tpmPara);
},
//点击级联选项
handleNodeClick1(data,node,domTree) {//这里是dialog对话框的树点击事件，增加和修改为同一事件
this.isShowSign=true;//这里是验证不为空，因为要异步取值；所以内置的验证不管用
this.showSign=false;
let tpmDom=domTree.$el.querySelector('.el-tree-node__expand-icon');
try{
if(q.style.display==='none'){
tpmDom.style.display="none";
};
}catch(e){};
let tpm='';
let tpmID='';
this.nameDepartment=data.name;
this.depIdOut=data.id;
if(this.isOutDepID){this.searchDepData=data.id};
this.levelArr1[node.level-1]=data;
for(let i=0;i<node.level;i++){
  tpm+=(this.levelArr1[i]['name']+'/')
  tpmID+=(this.levelArr1[i]['id']+',')
}
let len1=tpmID.length;
let len2=tpm.length;
tpmID=tpmID.substr(0,len1-1);
tpm=tpm.substr(0,len2-1);
this.nameTree=tpm;
this.depIdTrace1=tpmID;
this.backShowName=tpm;
this.formVinDiction.parentId=data.id;
this.updateData.depEmpMiddle.depIdTrace=this.depIdTrace1;
this.ruleForm1.depName=tpm;
},
handleNodeClick2(data,node,domTree){
let tpm='';
let tpmID='';
this.nameDepartment=data.name;
this.depIdOut=data.id;
if(this.isOutDepID){this.searchDepData=data.id};
this.levelArr1[node.level-1]=data;
for(let i=0;i<node.level;i++){
tpm+=(this.levelArr1[i]['name']+'/')
tpmID+=(this.levelArr1[i]['id']+',')
}
let len1=tpmID.length;
let len2=tpm.length;
//这里是去掉字符串后面的‘/’和‘,’
tpmID=tpmID.substr(0,len1-1);
tpm=tpm.substr(0,len2-1);
this.searchDepName=tpm;
},
//清除岗位数据
clearData() {
this.input3=""
},
clearData1(){
this.searchDepName='';
this.searchDepData='';
},
//获取opition列表
getMenuList() {
this.get(this.url15).then((m)=>{
if(m.data.result){
this.searchLoading=false;
this.tableLoading=false;
this.opitionsDepartment.push(...(m.data.data));
}
}).catch((m)=>{
console.log(m);
})
},
//获取列表
getEmployeeList(pageTpm) {
let tpmData = [];
this.get(this.url0,pageTpm).then((m)=>{
if(m.data.result){
this.searchLoading=false;
this.refleshLoading=false;
this.tableLoading=false;
this.getVin=m.data.data.list;
this.total=m.data.data.totalCount;
//this.searchDepName='';
//this.searchDepData='';
}
if(!m.data.result){
this.$notify({
title: '提示',
message:m.data.msg ,
type: 'warning'
});
}
}).catch((err)=>{console.log(err)});
},
/*
getEmployeeList(pageTpm) {
this.get(this.url6,pageTpm).then((m)=>{
if(m.data.result){
this.searchLoading=false;
this.tableLoading=false;
this.tableData=m.data.data.list;
this.total=m.data.data.totalCount;
}
}).catch((m)=>{
console.log(m);
})
},
*/
//分页功能
handleCurrentChange1(val) {
this.tableLoading=true;
let para = {
pageIndex: val,
};
this.tpmPara=Object.assign(this.tpmPara,para);
this.getEmployeeList(this.tpmPara);
}
},
mounted() {
this.tableLoading=true;
//初始化
let pageTpm={
pageIndex:1,
pageSize:10,
depId:'',
employeeName:'',
hireDateStart:'',
hireDateEnd:'',
email:'',
positionId:''
}
this.tpmPara=pageTpm;
let pageTpm1={
parentId:''
}
this.tpmPara1=pageTpm1;
this.getEmployeeList(this.tpmPara);
this.getMenuList();
this.getDepTree(pageTpm1);
}
}
</script>

<style lang="scss" scoped> 
.cascade{}
.check-sign-character{position: relative;top: -26px;left: 270px;color: red;font-size: 12px;}
.check-sign{position: relative;top: -25px;color: red;}
.optionIcon{position:absolute;position: absolute;top: 28px;left: 76px;font-size: 8px;color: #bfcbd9;cursor:pointer}
.oicon{left:116px}
.serch_input1{width: 92px;padding: 13px 7px;display: inline-block;}
.show-tree{width:100%;background:#fff;display:block!important;height:512px;border: 1px solid #c8c8c8;box-sizing:border-box;}
.el-cascader-menus1 {white-space: nowrap;background: #fff;position: absolute;margin: 5px 0;}
.showBox{transition: all 0.5s;}
.add-tree{border: 1px solid #bfcbd9;display:inline-block;width:100%;}
.add-tree .el-tree{border:none!important}
.add-tree .el-tree-node__content{background:#ccc!important}
.s{float:right;margin-top:4px}
.dialog-tree{width:100%;padding:0 0 16px;}
.department-tree{text-align:center;}
.department{position:relative;display:in}
.cascade-box{display:block;height:80px;min-width:50px;z-index:9999;position:absolute;top:120px;left:50%;float:left;background:#ccc}
.clear_block{display:block!important;}
.grid-content7{text-align:center;border:1px solid #eaeefb;color:#48576a;background:none}
.left-content{text-align:left;color:#F7BA2A}
.left-content p{margin:4px 0;color:#f47915}
</style>